<!DOCTYPE html>
<html lang="zh-cmn-Hans">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="renderer" content="webkit" />
  <meta name="viewport"
    content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0" />
  <link rel="icon" href="/peace.ico" />
  <title>
    HPC账务平台
  </title>
  <style>
    .first-loading-wrp {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      min-height: 420px;
      height: 100%
    }

    .first-loading-wrp>h1 {
      font-size: 128px
    }

    .first-loading-wrp .loading-wrp {
      padding: 98px;
      display: flex;
      justify-content: center;
      align-items: center
    }

    @keyframes configure-clockwise {
      0% {
        transform: rotate(0);
      }

      25% {
        transform: rotate(90deg);
      }

      50% {
        transform: rotate(180deg);
      }

      75% {
        transform: rotate(270deg);
      }

      100% {
        transform: rotate(360deg);
      }
    }

    @keyframes configure-xclockwise {
      0% {
        transform: rotate(45deg);
      }

      25% {
        transform: rotate(-45deg);
      }

      50% {
        transform: rotate(-135deg);
      }

      75% {
        transform: rotate(-225deg);
      }

      100% {
        transform: rotate(-315deg);
      }
    }

    * {
      box-sizing: border-box;
    }

    /* background-color: #37474f !important; */
    .spinner-box {
      width: 300px;
      height: 300px;
      position: absolute;
      top: calc(50% - 50px);
      left: calc(50% - 50px);
      justify-content: center;
      align-items: center;
      background-color: transparent;
    }

    .configure-border-1 {
      width: 115px;
      height: 115px;
      padding: 3px;
      position: absolute;
      display: flex;
      justify-content: center;
      align-items: center;
      background: #ffab91;
      animation: configure-clockwise 3s ease-in-out 0s infinite alternate;
    }

    .configure-border-2 {
      width: 115px;
      height: 115px;
      padding: 3px;
      left: -115px;
      display: flex;
      justify-content: center;
      align-items: center;
      background: rgb(63, 249, 220);
      transform: rotate(45deg);
      animation: configure-xclockwise 3s ease-in-out 0s infinite alternate;
    }

    .configure-core {
      width: 100%;
      height: 100%;
      background-color: #4671dd;
    }

    body::-webkit-scrollbar {
      display: none;
    }

    .background {
      background-color: #4671dd;
      /* border: 8px solid #37474f; */
      margin: -8px;
    }

    .n-form-item .n-form-item-feedback-wrapper {
      min-height: 0 !important;
      height: 0;
    }

    /* .n-form-item-label{
  text-align: right!important;
} */
    .n-button__content {
      font-size: 12px;
    }

    .tabs-view {
      border: 1px solid #fff !important;
      background-color: #fff !important;
      font-size: 12px;
      line-height: 50px;
      margin-bottom: 8px;
      padding-top: 0px !important;
      padding-bottom: 0px !important;
      height: 40px !important;
    }

    .tabs-card {
      height: 40px !important;
    }

    .tabs-card-scroll-item {
      line-height: 20px;
      background-color: #fff !important;
      margin-right: 0px !important;
      border-bottom-right-radius: 5px !important;
      border-bottom-left-radius: 5px !important;
      border: 1px solid #fff !important;
      height: 30px !important;
      margin-top: 10px !important;
      padding-top: 2px !important;
    }

    .active-item {
      height: 40px !important;
      border-top-right-radius: 10px !important;
      border-top-left-radius: 10px !important;
      background: #f6f6f6d6 !important;
      border: 1px solid #f6f6f6d6 !important;
      padding-bottom: 0px !important;
      margin-top: 10px !important;
      z-index: 999 !important;
    }

    .layout-header[data-v-45285d06] {
      box-shadow: 0 1px 0px rgb(0 21 41 / 8%) !important;
    }
  </style>
</head>

<body>
  <div id="appProvider" style="display: none"></div>
  <div id="app">
    <div class="background">
      <div class="spinner-box">
        <div class="configure-border-1">
          <div class="configure-core"></div>
        </div>
        <div class="configure-border-2">
          <div class="configure-core"></div>
        </div>
      </div>
    </div>
  </div>
  <script type="module" src="/src/main.ts"></script>
  <script>
    document.getElementsByClassName("background")[0].style.height = (document.documentElement.clientHeight + 'px')
    window.onresize = function () {
      if (document.getElementsByClassName("background")[0]) {
        document.getElementsByClassName("background")[0].style.height = (document.documentElement.clientHeight + 'px')
      }
    }
  </script>
</body>

</html>